// 查找所有角色

initUsers();
function initUsers() {
    $.ajax({
        url: '/role.do',
        method: 'GET',
        success: function (result) {
            if (result && result.length > 0) {
                for (var i = 0; i < result.length; i++) {
                    var val = result[i];
                    $(`<option>${val}<option> `).appendTo('select');
                }
            }
        }

    })
}


//通过INPUT调用图片预览
$("#myfile").change(function(){
view(this.files)
})


// //通过拖拽效果调用图片预览
var box=$("#mybox")[0];
//拖拽的东西在本元素（box）范围内活动（html默认是不让动）
 box.ondragover=function(e){
    //阻止html的默认行为
    e.preventDefault();
}
//拖拽的东西停留在本元素（box）中
box.ondrop=function(e){
     e.preventDefault();
     //获取用户从电脑上拖拽进来 的图片
     view(e.dataTransfer.files);
     //将拖拽来的文件给INPUT存一份
   document.querySelector('#myfile').files=e.dataTransfer.files;
   console.log(e.dataTransfer.files);
   console.log($('#myfile').att('files'));
}

//图片预览
function view(file_list){
    //便利图片列表
    for(let f of file_list){
        //创建文件读取器
        let reader=new FileReader();
        //读取图片
        reader.readAsDataURL(f);
        //在onload事件（读取完成并成功）
        reader.onload=function(data){
            //将图片数据给IMG标签
        $("#myphoto").attr('src',data.target.result);
        $("#mybox figcaption").hide();
        }
    }
}

//添加
$("#addBtn").click(function(){
    let name =$("#name").val().trim();
    let age =$("#age").val();
    let sex =$("input[name=sex]:checked").val();
    let phone =$("#phone").val();
    let idCard =$("#idCard").val();
    let role =$("#role_select").val();
    let photo =document.querySelector('#myfile').files[0];
    let state = 1;
    var formData=new FormData();
    formData.append('name',name);
    formData.append('age',age);
    formData.append('sex',sex);
    formData.append('phone',phone);
    formData.append('idCard',idCard);
    formData.append('role',role);
    formData.append('photo',photo);
    formData.append('state',state);
    $.ajax({
        url:'/addEmployee.do',
        method:'post',
        data:formData,
        processData:false,//告诉JQuery不要去处发送的数据
        contentType:false,//告诉JQuery不要去设置Content-Type请求头 
        success:function(result){
            if(result=='success'){
                location.href='employee.html';      
            }
        }
    })
})
